<template>
  <div class="app-container">

    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="80px">
      <el-form-item label="流程用户">
        <el-select
          v-model="queryParams.user"
          size="small"
          style="width: 240px" @change="handleUserChange">
          <el-option
            v-for="item in userOptions"
            :key="item.user"
            :label="item.userName"
            :value="item.user">
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>

    <el-card>
      <el-tabs v-model="activeName" @tab-click="handleTabClick">

        <el-tab-pane label="施工期" name="construction">

          <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
              <el-button
                type="primary"
                plain
                icon="el-icon-plus"
                size="mini"
                @click="openSelectConstructionMeterage"
                v-if="editFlag"
                v-hasPermi="['agency:meterage:detail:add']"
              >新增</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="success"
                plain
                icon="el-icon-edit"
                size="mini"
                :disabled="constructionSingle"
                @click="handleUpdateConstruction"
                v-if="editFlag"
                v-hasPermi="['agency:meterage:detail:edit']"
              >修改</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="danger"
                plain
                icon="el-icon-delete"
                size="mini"
                :disabled="constructionMultiple"
                @click="handleDeleteConstruction"
                v-if="editFlag"
                v-hasPermi="['agency:meterage:detail:remove']"
              >删除</el-button>
            </el-col>
          </el-row>

          <el-table v-loading="loading" :data="detailConstructionList"
                    @selection-change="handleSelectionConstructionChange" >
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="清单编号" align="left" prop="boqCode" width="100" />
            <el-table-column label="清单名称" align="left" prop="boqName" width="150" show-overflow-tooltip  />
            <el-table-column label="单位" align="center" prop="unit" />
            <el-table-column label="单价" align="center" prop="contractPrice" />
            <el-table-column label="折旧费" align="center" prop="contractDepreciationTotal" />
            <el-table-column label="合同数量" align="center" prop="contractPersonAmount" />
            <el-table-column label="合同期数" align="center" prop="contractPeriodAmount" />
            <el-table-column label="本次计量数量" align="center" prop="personAmount" />
            <el-table-column label="本次计量期数" align="center" prop="periodAmount" />

          </el-table>

          <pagination style="padding-top: 100px;"
            v-show="constructionTotal > 0"
            :total="constructionTotal"
            :page.sync="constructionQueryParams.pageNum"
            :limit.sync="constructionQueryParams.pageSize"
            @pagination="getConstructionList"
          />

          <!-- 修改施工期清单详情 -->
          <el-dialog :title="constructionTitle" :visible.sync="constructionOpen" :close-on-click-modal="false" width="550px" append-to-body>
            <el-form ref="constructionForm" :model="constructionForm" :rules="constructionRules" label-width="80px">

              <el-form-item label="清单编号" prop="boqCode">
                <el-input v-model="constructionForm.boqCode" placeholder="请输入清单编号" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="清单名称" prop="boqName">
                <el-input v-model="constructionForm.boqName" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="单价" prop="contractPrice">
                <el-input v-model="constructionForm.contractPrice" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="折旧费" prop="contractDepreciationTotal" v-if="constructionForm.contractPersonAmount == null">
                <el-input v-model="constructionForm.contractDepreciationTotal" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="合同数量" prop="contractPersonAmount" v-if="constructionForm.contractDepreciationTotal == null">
                <el-input v-model="constructionForm.contractPersonAmount" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="合同期数" prop="contractPersonAmount">
                <el-input v-model="constructionForm.contractPeriodAmount" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="本次数量" prop="personAmount" v-if="constructionForm.contractDepreciationTotal == null">
                <el-input v-model="constructionForm.personAmount" type="number" @input="personAmountInput(constructionForm)" oninput="value=value.replace(/^(0+)|[^\d]+/g,'')" placeholder="请输入本次数量"/>
              </el-form-item>

              <el-form-item label="本次期数" prop="periodAmount">
                <el-input v-model="constructionForm.periodAmount" type="number" @input="periodAmountInput(constructionForm)" @keydown.native="handleKey" placeholder="请输入本次期数">
                </el-input>
              </el-form-item>

              <el-form-item label="本次金额" prop="total">
                <el-input v-model="constructionForm.total">
                </el-input>
              </el-form-item>

            </el-form>

            <div slot="footer" class="dialog-footer">
              <el-button type="primary" @click="submitConstructionForm">确 定</el-button>
              <el-button @click="cancelConstruction">取 消</el-button>
            </div>

          </el-dialog>

        </el-tab-pane>

        <el-tab-pane label="冬休期" name="winter">

          <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
              <el-button
                type="primary"
                plain
                icon="el-icon-plus"
                size="mini"
                @click="openSelectWinterMeterage"
                v-if="editFlag"
                v-hasPermi="['agency:meterage:detail:add']"
              >新增</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="success"
                plain
                icon="el-icon-edit"
                size="mini"
                :disabled="winterSingle"
                @click="handleUpdateWinter"
                v-if="editFlag"
                v-hasPermi="['agency:meterage:detail:edit']"
              >修改</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="danger"
                plain
                icon="el-icon-delete"
                size="mini"
                :disabled="winterMultiple"
                @click="handleDeleteWinter"
                v-if="editFlag"
                v-hasPermi="['agency:meterage:detail:remove']"
              >删除</el-button>
            </el-col>
          </el-row>

          <el-table v-loading="loading" :data="detailWinterList"
                    @selection-change="handleSelectionWinterChange" >
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="清单编号" align="left" prop="boqCode" width="100" />
            <el-table-column label="清单名称" align="left" prop="boqName" width="150" show-overflow-tooltip  />
            <el-table-column label="单位" align="center" prop="unit" />
            <el-table-column label="单价" align="center" prop="contractPrice" />
            <el-table-column label="折旧费" align="center" prop="contractDepreciationTotal" />
            <el-table-column label="合同数量" align="center" prop="contractPersonAmount" />
            <el-table-column label="合同总期数" align="center" prop="contractPeriodAmount" />
            <el-table-column label="本次计量数量" align="center" prop="personAmount" />
            <el-table-column label="本次计量期数" align="center" prop="periodAmount" />

          </el-table>

          <pagination style="padding-top: 100px;"
            v-show="winterTotal > 0"
            :total="winterTotal"
            :page.sync="winterQueryParams.pageNum"
            :limit.sync="winterQueryParams.pageSize"
            @pagination="getWinterList"
          />

          <!-- 修改冬休期清单详情 -->
          <el-dialog :title="winterTitle" :visible.sync="winterOpen" :close-on-click-modal="false" width="550px" append-to-body>
            <el-form ref="winterForm" :model="winterForm" :rules="winterRules" label-width="80px">

              <el-form-item label="清单编号" prop="boqCode">
                <el-input v-model="winterForm.boqCode" placeholder="请输入清单编号" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="清单名称" prop="boqName">
                <el-input v-model="winterForm.boqName" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="单价" prop="contractPrice">
                <el-input v-model="winterForm.contractPrice" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="折旧费" prop="contractDepreciationTotal" v-if="winterForm.contractPersonAmount == null">
                <el-input v-model="winterForm.contractDepreciationTotal" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="合同数量" prop="contractPersonAmount" v-if="winterForm.contractDepreciationTotal == null">
                <el-input v-model="winterForm.contractPersonAmount" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="合同期数" prop="contractPersonAmount">
                <el-input v-model="winterForm.contractPeriodAmount" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="本次数量" prop="personAmount" v-if="winterForm.contractDepreciationTotal == null">
                <el-input v-model="winterForm.personAmount" type="number" @input="personAmountInput(winterForm)" oninput="value=value.replace(/^(0+)|[^\d]+/g,'')" placeholder="请输入本次数量"/>
              </el-form-item>

              <el-form-item label="本次期数" prop="periodAmount">
                <el-input v-model="winterForm.periodAmount" type="number" @input="periodAmountInput(winterForm)" @keydown.native="handleKey" placeholder="请输入本次期数">
                </el-input>
              </el-form-item>

              <el-form-item label="本次金额" prop="total">
                <el-input v-model="winterForm.total">
                </el-input>
              </el-form-item>

            </el-form>

            <div slot="footer" class="dialog-footer">
              <el-button type="primary" @click="submitWinterForm">确 定</el-button>
              <el-button @click="cancelWinter">取 消</el-button>
            </div>

          </el-dialog>

        </el-tab-pane>

        <el-tab-pane label="缺陷责任期" name="defect">

          <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
              <el-button
                type="primary"
                plain
                icon="el-icon-plus"
                size="mini"
                @click="openSelectDefectMeterage"
                v-if="editFlag"
                v-hasPermi="['agency:meterage:detail:add']"
              >新增</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="success"
                plain
                icon="el-icon-edit"
                size="mini"
                :disabled="defectSingle"
                @click="handleUpdateDefect"
                v-if="editFlag"
                v-hasPermi="['agency:meterage:detail:edit']"
              >修改</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="danger"
                plain
                icon="el-icon-delete"
                size="mini"
                :disabled="defectMultiple"
                @click="handleDeleteDefect"
                v-if="editFlag"
                v-hasPermi="['agency:meterage:detail:remove']"
              >删除</el-button>
            </el-col>
          </el-row>

          <el-table v-loading="loading" :data="detailDefectList"
                    @selection-change="handleSelectionDefectChange" >
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="清单编号" align="left" prop="boqCode" width="100" />
            <el-table-column label="清单名称" align="left" prop="boqName" width="150" show-overflow-tooltip  />
            <el-table-column label="单位" align="center" prop="unit" />
            <el-table-column label="单价" align="center" prop="contractPrice" />
            <el-table-column label="折旧费" align="center" prop="contractDepreciationTotal" />
            <el-table-column label="合同数量" align="center" prop="contractPersonAmount" />
            <el-table-column label="合同总期数" align="center" prop="contractPeriodAmount" />
            <el-table-column label="本次计量数量" align="center" prop="personAmount" />
            <el-table-column label="本次计量期数" align="center" prop="periodAmount" />

          </el-table>

          <pagination style="padding-top: 100px;"
            v-show="defectTotal > 0"
            :total="defectTotal"
            :page.sync="defectQueryParams.pageNum"
            :limit.sync="defectQueryParams.pageSize"
            @pagination="getDefectList"
          />

          <!-- 修改缺陷责任期清单详情 -->
          <el-dialog :title="defectTitle" :visible.sync="defectOpen" :close-on-click-modal="false" width="550px" append-to-body>
            <el-form ref="defectForm" :model="defectForm" :rules="defectRules" label-width="80px">

              <el-form-item label="清单编号" prop="boqCode">
                <el-input v-model="defectForm.boqCode" placeholder="请输入清单编号" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="清单名称" prop="boqName">
                <el-input v-model="defectForm.boqName" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="单价" prop="contractPrice">
                <el-input v-model="defectForm.contractPrice" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="折旧费" prop="contractDepreciationTotal" v-if="defectForm.contractPersonAmount == null">
                <el-input v-model="defectForm.contractDepreciationTotal" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="合同数量" prop="contractPersonAmount" v-if="defectForm.contractDepreciationTotal == null">
                <el-input v-model="defectForm.contractPersonAmount" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="合同期数" prop="contractPersonAmount">
                <el-input v-model="defectForm.contractPeriodAmount" :readonly="true">
                </el-input>
              </el-form-item>

              <el-form-item label="本次数量" prop="personAmount" v-if="defectForm.contractDepreciationTotal == null">
                <el-input v-model="defectForm.personAmount" type="number" @input="personAmountInput(defectForm)" oninput="value=value.replace(/^(0+)|[^\d]+/g,'')" placeholder="请输入本次数量"/>
              </el-form-item>

              <el-form-item label="本次期数" prop="periodAmount">
                <el-input v-model="defectForm.periodAmount" type="number" @input="periodAmountInput(defectForm)" @keydown.native="handleKey" placeholder="请输入本次期数">
                </el-input>
              </el-form-item>

              <el-form-item label="本次金额" prop="total">
                <el-input v-model="defectForm.total">
                </el-input>
              </el-form-item>

            </el-form>

            <div slot="footer" class="dialog-footer">
              <el-button type="primary" @click="submitDefectForm">确 定</el-button>
              <el-button @click="cancelDefect">取 消</el-button>
            </div>

          </el-dialog>

        </el-tab-pane>

        <el-tab-pane label="其他支付项目" name="other">

          <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
              <el-button
                type="primary"
                plain
                icon="el-icon-refresh"
                size="mini"
                @click="handleSyncItem"
                v-if="editFlag"
                v-hasPermi="['agency:meterage:detail:add']"
              >同步支付项目</el-button>
            </el-col>
          </el-row>

          <el-table v-loading="loading" :row-style="{height: '0'}" :data="detailOtherList" @selection-change="handleSelectionOtherChange" >
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="支付项目名称" align="left" prop="itemName" width="200"  show-overflow-tooltip />
            <el-table-column label="支付金额" align="center" prop="total" width="200">
              <template slot-scope="scope">
                <span v-if="scope.row.isEdit == 'N'">{{scope.row.total}}</span>
                <span v-else style="color: red;">{{scope.row.total}}</span>
              </template>
            </el-table-column>

            <el-table-column label="备注信息" align="center" prop="remark" />

            <el-table-column
              label="操作"
              align="center"
              width="160"
              class-name="small-padding fixed-width"
            >
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  @click="handleUpdateOther(scope.row)"
                  v-if="editFlag"
                  v-hasPermi="['agency:meterage:detail:edit']"
                >修改</el-button>

              </template>
            </el-table-column>

          </el-table>

          <pagination
            v-show="otherTotal > 0"
            :total="otherTotal"
            :page.sync="otherQueryParams.pageNum"
            :limit.sync="otherQueryParams.pageSize"
            @pagination="getOtherList"
          />

          <!-- 修改代建计量其他支付项目详情对话框 -->
          <el-dialog :title="otherTitle" :visible.sync="otherOpen" :close-on-click-modal="false" width="600px" append-to-body>

            <el-form ref="otherForm" :model="otherForm" :rules="otherRules" label-width="80px">

              <el-form-item label="名　　称" prop="itemName">
                <el-input v-model="otherForm.itemName" :readonly="true" />
              </el-form-item>

              <el-form-item label="金　　额" prop="total">
                <el-input v-model="otherForm.total" type="number" @keydown.native="handleKey" placeholder="请输入金额" clearable :style="{width: '100%'}" />
              </el-form-item>

              <el-form-item label="备　　注" prop="remark">
                <el-input v-model="otherForm.remark" type="textarea" placeholder="请输入备注信息" :style="{width: '100%'}"></el-input>
              </el-form-item>

            </el-form>

            <div slot="footer" class="dialog-footer">
              <el-button type="primary" @click="submitOtherForm">确 定</el-button>
              <el-button @click="cancelOther">取 消</el-button>
            </div>

          </el-dialog>

        </el-tab-pane>

      </el-tabs>
    </el-card>

    <select-construction-meterage ref="selectConstruction" :masterId="queryParams.masterId" @ok="handleQuery(false)"></select-construction-meterage>

    <select-winter-meterage ref="selectWinter" :masterId="queryParams.masterId" @ok="handleQuery(false)"></select-winter-meterage>

    <select-defect-meterage ref="selectDefect" :masterId="queryParams.masterId" @ok="handleQuery(false)"></select-defect-meterage>

  </div>
</template>

<script>

import { selectUserOptions, listDetailConstruction, listDetailWinter, listDetailDefect,
  getDetailConstruction, getDetailWinter, getDetailDefect,
  updateDetailConstruction, deleteDetailConstruction,
  updateDetailWinter, deleteDetailWinter,
  updateDetailDefect, deleteDetailDefect,
  listDetailOther, syncDetailOtherItem, getDetailOther, updateDetailOther } from "@/api/agency/meterageDetail";
import selectConstructionMeterage from "@/views/agency/meterage/selectConstructionMeterage";
import selectWinterMeterage from "@/views/agency/meterage/selectWinterMeterage";
import selectDefectMeterage from "@/views/agency/meterage/selectDefectMeterage";
import * as math from "mathjs";


export default {
  name: "MeterageDetail",
  components: { selectConstructionMeterage, selectWinterMeterage, selectDefectMeterage },
  data() {
    return {
      activeName: "construction",
      // 不能编辑的原因
      // 1.该数据未锁定
      // 2.该数据的当前用户不等于登录用户
      // 3.选择用户不等于登录用户
      editFlag: true,
      // 主表状态
      status: null,
      // 当前登录用户
      loginUser: null,
      // 当前流程所在用户
      currentUser: null,
      // 选择用户
      selectUserName: null,
      // 用户下拉框
      userOptions: [],
      // 遮罩层
      loading: false,
      // 非单个禁用
      constructionSingle: true,
      winterSingle: true,
      defectSingle: true,
      otherSingle: true,
      // 非多个禁用
      constructionMultiple: true,
      winterMultiple: true,
      defectMultiple: true,
      otherMultiple: true,
      // 显示搜索条件
      showSearch: true,
      // 选中数组
      constructionIds: [],
      winterIds: [],
      defectIds: [],
      otherIds: [],
      // 施工期清单表格数据
      detailConstructionList: [],
      constructionTotal: 0,
      // 冬休期清单表格数据
      detailWinterList: [],
      winterTotal: 0,
      // 缺陷责任期清单表格数据
      detailDefectList: [],
      defectTotal: 0,
      // 其他支付项目表格数据
      detailOtherList: [],
      otherTotal: 0,
      // 弹出层标题
      constructionTitle: "",
      winterTitle: "",
      defectTitle: "",
      otherTitle: "",
      // 是否显示弹出层
      constructionOpen: false,
      winterOpen: false,
      defectOpen: false,
      otherOpen: false,
      // 保存修改前的数量
      beforeUpdateAmount: 0,
      // 查询参数
      queryParams: {
        masterId: null,
        user: null,
        boqCode: null,
        boqName: null,
      },
      constructionQueryParams: {
        pageNum: 1,
        pageSize: 10,
        masterId: null,
        user: null
      },
      winterQueryParams: {
        pageNum: 1,
        pageSize: 10,
        masterId: null,
        user: null
      },
      defectQueryParams: {
        pageNum: 1,
        pageSize: 10,
        masterId: null,
        user: null
      },
      otherQueryParams: {
        pageNum: 1,
        pageSize: 10,
        masterId: null,
        user: null
      },
      // 表单参数
      constructionForm: {
      },
      winterForm: {
      },
      defectForm: {
      },
      otherForm: {
      },
      // 表单验证
      constructionRules: {

      },
      winterRules: {

      },
      defectRules: {

      },
      otherRules: {

      }
    }
  },
  created() {
    this.loginUser = this.$store.state.user.name;
    this.queryParams.masterId = this.$route.query.masterId;
    this.constructionQueryParams.masterId = this.$route.query.masterId;
    this.winterQueryParams.masterId = this.$route.query.masterId;
    this.defectQueryParams.masterId = this.$route.query.masterId;
    this.otherQueryParams.masterId = this.$route.query.masterId;
    this.status = this.$route.query.status;
    this.selectUserOptions();
  },
  methods: {
    handleTabClick() {
      this.choiceList(true);
    },
    // 选择加载的列表
    choiceList(flag) {
      if (flag) {
        this.constructionQueryParams.pageNum = 1;
        this.winterQueryParams.pageNum = 1;
        this.defectQueryParams.pageNum = 1;
        this.otherQueryParams.pageNum = 1;
      }
      if (this.activeName == "construction") {
        this.getConstructionList();
      } else if (this.activeName == "winter") {
        this.getWinterList();
      } else if (this.activeName == "defect") {
        this.getDefectList();
      } else if (this.activeName == "other") {
        this.getOtherList();
      }
    },
    /** 获取用户节点列表 */
    selectUserOptions() {
      selectUserOptions(this.queryParams.masterId).then(response => {
        this.currentUser = response.currentUser;
        if (this.loginUser != this.currentUser || this.status == '1') {
          this.editFlag = false;
        } else {
          this.editFlag = true;
        }
        this.constructionQueryParams.user = response.currentUser;
        this.winterQueryParams.user = response.currentUser;
        this.defectQueryParams.user = response.currentUser;
        this.otherQueryParams.user = response.currentUser;
        this.queryParams.user = response.currentUser;
        this.userOptions = response.nodes;
        this.choiceList();
      });
    },
    // 用户下拉改变触发事件
    handleUserChange(val) {
      if (this.loginUser == this.currentUser && this.status == "0" && this.loginUser == val) {
        this.editFlag = true;
      } else {
        this.editFlag = false;
      }
      this.constructionQueryParams.user = this.queryParams.user;
      this.winterQueryParams.user = this.queryParams.user;
      this.defectQueryParams.user = this.queryParams.user;
      this.otherQueryParams.user = this.queryParams.user;
      this.queryParams.user = this.queryParams.user;

      this.choiceList();
    },
    /** 搜索按钮操作 */
    handleQuery(flag) {
      this.choiceList(flag);
    },
    // 查询施工期列表
    getConstructionList() {
      this.loading = true;
      listDetailConstruction(this.constructionQueryParams).then(response => {
        this.detailConstructionList = response.rows;
        this.constructionTotal = response.total;
        this.loading = false;
      });
    },
    // 查询冬休期列表
    getWinterList() {
      this.loading = true;
      listDetailWinter(this.winterQueryParams).then(response => {
        this.detailWinterList = response.rows;
        this.winterTotal = response.total;
        this.loading = false;
      });
    },
    // 查询缺陷责任期列表
    getDefectList() {
      this.loading = true;
      listDetailDefect(this.defectQueryParams).then(response => {
        this.detailDefectList = response.rows;
        this.defectTotal = response.total;
        this.loading = false;
      });
    },
    // 查询其他支付项目列表
    getOtherList() {
      this.loading = true;
      listDetailOther(this.otherQueryParams).then(response => {
        this.detailOtherList = response.rows;
        this.otherTotal = response.total;
        this.loading = false;
      });
    },
    // 多选框选中数据
    handleSelectionConstructionChange(selection) {
      this.constructionIds = selection.map(item => item.id)
      this.constructionSingle = selection.length!==1
      this.constructionMultiple = !selection.length
    },
    handleSelectionWinterChange(selection) {
      this.winterIds = selection.map(item => item.id)
      this.winterSingle = selection.length!==1
      this.winterMultiple = !selection.length
    },
    handleSelectionDefectChange(selection) {
      this.defectIds = selection.map(item => item.id)
      this.defectSingle = selection.length!==1
      this.defectMultiple = !selection.length
    },
    handleSelectionOtherChange(selection) {
      this.otherIds = selection.map(item => item.id)
      this.otherSingle = selection.length!==1
      this.otherMultiple = !selection.length
    },
    // 打开选择施工期清单窗口
    openSelectConstructionMeterage() {
      this.$refs.selectConstruction.show();
    },
    // 打开选择冬休期清单窗口
    openSelectWinterMeterage() {
      this.$refs.selectWinter.show();
    },
    // 打开选择缺陷责任期清单窗口
    openSelectDefectMeterage() {
      this.$refs.selectDefect.show();
    },
    // 表单重置
    constructionReset() {
      this.constructionForm = {
        id: null,
        masterId: null,
        institutionBoqCode: null,
        boqCode: null,
        boqName: null,
        ancestors: null,
        orderNum: null,
        unit: null,
        contractDepreciationTotal: null,
        contractPersonAmount: null,
        contractPeriodAmount: null,
        contractPrice: null,
        contractTotal: null,
        personAmount: null,
        periodAmount: null,
        total: null,
        isEdit: null,
        complete: null,
        annexUuid: null,
        dept: null,
        deptName: null,
        user: null,
        userName: null
      };
      this.resetForm("contractForm");
    },
    winterReset() {
      this.winterForm = {
        id: null,
        masterId: null,
        institutionBoqCode: null,
        boqCode: null,
        boqName: null,
        ancestors: null,
        orderNum: null,
        unit: null,
        contractDepreciationTotal: null,
        contractPersonAmount: null,
        contractPeriodAmount: null,
        contractPrice: null,
        contractTotal: null,
        personAmount: null,
        periodAmount: null,
        total: null,
        isEdit: null,
        complete: null,
        annexUuid: null,
        dept: null,
        deptName: null,
        user: null,
        userName: null
      };
      this.resetForm("winterForm");
    },
    defectReset() {
      this.defectForm = {
        id: null,
        masterId: null,
        institutionBoqCode: null,
        boqCode: null,
        boqName: null,
        ancestors: null,
        orderNum: null,
        unit: null,
        contractDepreciationTotal: null,
        contractPersonAmount: null,
        contractPeriodAmount: null,
        contractPrice: null,
        contractTotal: null,
        personAmount: null,
        periodAmount: null,
        total: null,
        isEdit: null,
        complete: null,
        annexUuid: null,
        dept: null,
        deptName: null,
        user: null,
        userName: null
      };
      this.resetForm("defectForm");
    },
    otherReset() {
      this.otherForm = {
        id: null,
        masterId: null,
        itemName: null,
        itemCode: null,
        itemOrder: null,
        total: null,
        isEdit: null,
        annexUuid: null,
        remark: null,
        dept: null,
        deptName: null,
        user: null,
        userName: null
      };
      this.resetForm("otherForm");
    },
    /** 修改施工期清单按钮操作 */
    handleUpdateConstruction(row) {
      this.constructionReset();
      const id = row.id || this.constructionIds;
      getDetailConstruction(id).then(response => {
        this.constructionForm = response.data;
        this.constructionOpen = true;
        this.constructionTitle = "施工期清单详情修改";
      });
    },
    /** 施工期提交按钮 */
    submitConstructionForm() {
      this.$refs["constructionForm"].validate(valid => {
        if (valid) {
          if (this.constructionForm.id != null) {
            updateDetailConstruction(this.constructionForm).then(response => {
              this.$modal.msgSuccess("操作成功");
              this.constructionOpen = false;
              this.choiceList()
            });
          }
        }
      });
    },
    // 取消按钮
    cancelConstruction() {
      this.constructionOpen = false;
      this.constructionReset();
    },
    /** 修改冬休期清单按钮操作 */
    handleUpdateWinter(row) {
      this.winterReset();
      const id = row.id || this.winterIds;
      getDetailWinter(id).then(response => {
        this.winterForm = response.data;
        this.winterOpen = true;
        this.winterTitle = "冬休期清单详情修改";
      });
    },
    /** 冬休期提交按钮 */
    submitWinterForm() {
      this.$refs["winterForm"].validate(valid => {
        if (valid) {
          if (this.winterForm.id != null) {
            updateDetailWinter(this.winterForm).then(response => {
              this.$modal.msgSuccess("操作成功");
              this.winterOpen = false;
              this.choiceList()
            });
          }
        }
      });
    },
    // 取消按钮
    cancelWinter() {
      this.winterOpen = false;
      this.winterReset();
    },
    /** 修改缺陷责任期清单按钮操作 */
    handleUpdateDefect(row) {
      this.defectReset();
      const id = row.id || this.defectIds;
      getDetailDefect(id).then(response => {
        this.defectForm = response.data;
        this.defectOpen = true;
        this.defectTitle = "缺陷责任期清单详情修改";
      });
    },
    /** 缺陷责任期提交按钮 */
    submitDefectForm() {
      this.$refs["defectForm"].validate(valid => {
        if (valid) {
          if (this.defectForm.id != null) {
            updateDetailDefect(this.defectForm).then(response => {
              this.$modal.msgSuccess("操作成功");
              this.defectOpen = false;
              this.choiceList()
            });
          }
        }
      });
    },
    // 取消按钮
    cancelDefect() {
      this.defectOpen = false;
      this.defectReset();
    },
    // 人数input事件
    personAmountInput(form) {
      let contractPersonAmount = form.contractPersonAmount;
      let personAmount = form.personAmount;
      let contractPrice = form.contractPrice;
      if (personAmount > contractPersonAmount) {
        form.personAmount = null;
        form.total = null;
      } else {
        if (contractPrice != null && form.periodAmount != null && personAmount != null) {
          // 计算金额
          form.total = math.round(personAmount * form.periodAmount * contractPrice, 6);
        } else {
          form.total = null;
        }
      }
    },
    // 期数input事件
    periodAmountInput(form) {
      let contractPeriodAmount = form.contractPeriodAmount;
      let contractPersonAmount = form.contractPersonAmount;
      let periodAmount = form.periodAmount;
      let contractPrice = form.contractPrice;
      if (periodAmount > contractPeriodAmount) {
        form.periodAmount = null;
        form.total = null;
      } else {
        let personAmount = form.personAmount;
        if (contractPersonAmount != null) {
          // 人员金额计算
          if (contractPrice != null && periodAmount != null && personAmount != null) {
            // 计算金额
            form.total = math.round(personAmount * form.periodAmount * contractPrice, 6);
          } else {
            form.total = null;
          }
        } else {
          // 非人员金额计算
          if (periodAmount != null) {
            let contractDepreciationTotal = form.contractDepreciationTotal;
            form.total = math.round(math.round(contractDepreciationTotal * form.periodAmount, 6) + math.round(form.contractPrice * periodAmount, 6), 6);
          } else {
            form.total = null;
          }
        }
      }
    },
    // 施工期删除按钮操作
    handleDeleteConstruction(row) {
      const ids = row.id || this.constructionIds;
      this.$modal.confirm('确认删除选中的数据项？').then(function() {
        return deleteDetailConstruction(ids);
      }).then(() => {
        this.choiceList();
        this.$modal.msgSuccess("操作成功");
      }).catch(() => {});
    },
    // 冬休期删除按钮操作
    handleDeleteWinter(row) {
      const ids = row.id || this.winterIds;
      this.$modal.confirm('确认删除选中的数据项？').then(function() {
        return deleteDetailWinter(ids);
      }).then(() => {
        this.choiceList();
        this.$modal.msgSuccess("操作成功");
      }).catch(() => {});
    },
    // 缺陷责任期删除按钮操作
    handleDeleteDefect(row) {
      const ids = row.id || this.defectIds;
      this.$modal.confirm('确认删除选中的数据项？').then(function() {
        return deleteDetailDefect(ids);
      }).then(() => {
        this.choiceList();
        this.$modal.msgSuccess("操作成功");
      }).catch(() => {});
    },
    // 同步支付项目按钮
    handleSyncItem() {
      this.$modal.confirm('同步支付项目将会删除原有数据，确定执行该操作？').then(() => {
        return syncDetailOtherItem(this.otherQueryParams.masterId);
      }).then(() => {
        this.$modal.msgSuccess("操作成功");
        this.choiceList();
      }).catch(() => {});
    },
    /** 修改其他支付项目按钮操作 */
    handleUpdateOther(row) {
      this.otherReset();
      const id = row.id || this.otherIds;
      getDetailOther(id).then(response => {
        this.otherForm = response.data;
        this.otherOpen = true;
        this.otherTitle = "其他支付项目详情修改";
      });
    },
    /** 其他支付项目提交按钮 */
    submitOtherForm() {
      this.$refs["otherForm"].validate(valid => {
        if (valid) {
          if (this.otherForm.id != null) {
            updateDetailOther(this.otherForm).then(response => {
              this.$modal.msgSuccess("操作成功");
              this.otherOpen = false;
              this.choiceList()
            });
          }
        }
      });
    },
    // 取消按钮
    cancelOther() {
      this.otherOpen = false;
      this.otherReset();
    },
    // 禁止输入e
    handleKey(e) {
      let key = e.key
      // 不允许输入'e'
      if (key === 'e') {
        e.returnValue = false
        return false
      }
      return true
    },
  }
};
</script>

<style lang="scss">
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
  }
  input[type='number'] {
    -moz-appearance: textfield;
  }
</style>
